<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
 <meta charset="utf-8">
 <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
 <title>商家推广</title>

 <link rel="stylesheet" type="text/css" th:href="@{/assets/css/bootstrap.min.css}">

 <link rel="stylesheet" type="text/css" th:href="@{/assets/fonts/line-icons.css}">

 <link rel="stylesheet" th:href="@{/assets/plugins/morris/morris.css}">

 <link rel="stylesheet" type="text/css" th:href="@{/assets/css/main.css}">

 <link rel="stylesheet" type="text/css" th:href="@{/assets/css/responsive.css}">

 <link th:href="@{/fileinput/css/fileinput.css}" media="all" rel="stylesheet" type="text/css"/>

 <link rel="stylesheet" th:href="@{https://use.fontawesome.com/releases/v5.5.0/css/all.css}" crossorigin="anonymous">

 <link th:href="@{/fileinput/themes/explorer-fas/theme.css}" media="all" rel="stylesheet" type="text/css"/>

 <script th:src="@{/ckeditor/ckeditor.js}" type="text/javascript"></script>

 <script th:src="@{/assets/js/jquery-min.js}"></script>

</head>
<body>
<div class="app header-default side-nav-dark">
 <div class="layout">

  <div class="page-container pl-0">

   <div class="main-content">
    <div class="container-fluid">
     <div class="card">
      <div class="card-header border-bottom">
       <h4 class="card-title">商家信息</h4>
      </div>
      <div class="card-body">
       <div class="row">
        <div class="col-lg-10 col-md-12 col-xs-12">
         <form action="/admin/merchant/addOrModify" onsubmit="return check();" role="form" method="post" id="form-validation" novalidate="novalidate" th:object="${merchant}">
          <div class="form-group row">
           <label class="col-sm-2 col-form-label control-label">商家姓名</label>
           <div class="col-sm-10 position-relative">
            <div th:if="${merchant!=null}">
            <input type="text" th:value="*{id}" hidden class="form-control" name="id">
            <input type="text" th:value="*{name}" class="form-control" name="name" placeholder="商家姓名">
            </div>
            <div th:if="${merchant} == null">
            <input type="text" class="form-control" name="name" placeholder="商家姓名">
            </div>
            <div id="nameInfo" class="position-absolute" style="right: -118px;top: 10px;width: 120px;"></div>
           </div>
          </div>
          <div class="form-group row">
           <label class="col-sm-2 col-form-label control-label">联系电话</label>
           <div class="col-sm-10 position-relative">
            <div th:if="${merchant!=null}">
             <input type="text" th:value="*{phone}" class="form-control" name="phone" placeholder="联系电话">
            </div>
            <div th:if="${merchant} == null">
             <input type="text" class="form-control" name="phone" placeholder="联系电话">
            </div>
            <div id="phoneInfo" class="position-absolute" style="right: -118px;top: 10px;width: 120px;"></div>
           </div>
          </div>
          <div class="form-group row">
           <label class="col-sm-2 col-form-label control-label">银行卡开户行名称*</label>
           <div class="col-sm-10 position-relative">
            <select class="form-control custom-select chosen" name="bankCardType" required style="color: #232323;">
             <div th:each="para:${paras}" th:if="${merchant != null}">
              <option th:value="${para.parana}" th:text="${para.parana}" th:selected="${merchant.bankCardType == para.parana}"></option>
             </div>
             <div th:each="para:${paras}" th:if="${merchant == null}">
              <option th:value="${para.parana}" th:text="${para.parana}"></option>
             </div>
            </select>
            <!--<div th:if="${merchant!=null}">
             <input type="text" th:value="*{bankCardType}" class="form-control" name="bankCardType" placeholder="银行卡开户行名称">
            </div>
            <div th:if="${merchant} == null">

             <input type="text" class="form-control" name="bankCardType" placeholder="银行卡开户行名称">
            </div>
            <div id="typeInfo" class="position-absolute" style="right: -118px;top: 10px;width: 120px;"></div>
            --><!--<select class="form-control custom-select chosen" name="acctType" required style="color: #232323;">
             <div th:if="${merchant != null}">
              <option value="1" th:selected="*{acctType == '1'}">微信</option>
              <option value="2" th:selected="*{acctType == '2'}">支付宝</option>
             </div>
             <div th:if="${merchant == null}">
              <option value="1">微信</option>
              <option value="2">支付宝</option>
             </div>
            </select>
            <div id="acctInfo" class="position-absolute" style="right: -98px;top: 10px;width: 100px;"></div>-->
           </div>
          </div>
          <div class="form-group row">
           <label class="col-sm-2 col-form-label control-label">银行卡账户*</label>
           <div class="col-sm-10 position-relative">
            <div th:if="${merchant!=null}">
            <input type="text" th:value="*{bankCardNum}" class="form-control" name="bankCardNum" placeholder="银行卡账户">
            </div>
            <div th:if="${merchant} == null">
            <input type="text" class="form-control" name="bankCardNum" placeholder="银行卡账户">
            </div>
            <div id="bankInfo" class="position-absolute" style="right: -118px;top: 10px;width: 120px;"></div>
           </div>
          </div>
          <div class="form-group row">
           <label class="col-sm-2 col-form-label control-label">银行卡持卡人姓名*</label>
           <div class="col-sm-10 position-relative">
            <div th:if="${merchant!=null}">
             <input type="text" th:value="*{bankCardName}" class="form-control" name="bankCardName" placeholder="银行卡持卡人姓名">
            </div>
            <div th:if="${merchant} == null">
             <input type="text" class="form-control" name="bankCardName" placeholder="银行卡持卡人姓名">
            </div>
            <div id="bcnInfo" class="position-absolute" style="right: -118px;top: 10px;width: 120px;"></div>
           </div>
          </div>
          <div class="form-group row">
           <label class="col-sm-2 col-form-label control-label">支付宝账户</label>
           <div class="col-sm-10 position-relative">
            <div th:if="${merchant!=null}">
             <input type="text" th:value="*{alipayNum}" class="form-control" name="alipayNum" placeholder="支付宝账户">
            </div>
            <div th:if="${merchant} == null">
             <input type="text" class="form-control" name="alipayNum" placeholder="支付宝账户">
            </div>
            <div id="aliInfo" class="position-absolute" style="right: -118px;top: 10px;width: 120px;"></div>
           </div>
          </div>
          <div class="form-group row">
           <label class="col-sm-2 col-form-label control-label">支付宝名称</label>
           <div class="col-sm-10 position-relative">
            <div th:if="${merchant!=null}">
             <input type="text" th:value="*{alipayName}" class="form-control" name="alipayName" placeholder="支付宝名称">
            </div>
            <div th:if="${merchant} == null">
             <input type="text" class="form-control" name="alipayName" placeholder="支付宝名称">
            </div>
            <div id="alnInfo" class="position-absolute" style="right: -118px;top: 10px;width: 120px;"></div>
           </div>
          </div>
          <div class="form-group row">
           <label class="col-sm-2 col-form-label control-label">微信账户</label>
           <div class="col-sm-10 position-relative">
            <div th:if="${merchant!=null}">
             <input type="text" th:value="*{wechatNum}" class="form-control" name="wechatNum" placeholder="微信账户">
            </div>
            <div th:if="${merchant} == null">
             <input type="text" class="form-control" name="wechatNum" placeholder="微信账户">
            </div>
            <div id="wecInfo" class="position-absolute" style="right: -118px;top: 10px;width: 120px;"></div>
           </div>
          </div>
          <div class="form-group row">
           <label class="col-sm-2 col-form-label control-label">微信名称</label>
           <div class="col-sm-10 position-relative">
            <div th:if="${merchant!=null}">
             <input type="text" th:value="*{wechatName}" class="form-control" name="wechatName" placeholder="微信名称">
            </div>
            <div th:if="${merchant} == null">
             <input type="text" class="form-control" name="wechatName" placeholder="微信名称">
            </div>
            <div id="wenInfo" class="position-absolute" style="right: -118px;top: 10px;width: 120px;"></div>
           </div>
          </div>
          <span th:if="${merchant} == null"><button type="submit" class="btn btn-outline-success">添加</button></span>
          <span th:unless="${merchant} == null"><button type="submit" class="btn btn-outline-info">修改</button></span>
         </form>
        </div>
       </div>
      </div>
     </div>
    </div>
   </div>
  </div>

 </div>
</div>

<div id="preloader">
 <div class="loader" id="loader-1"></div>
</div>

<script th:src="@{/assets/js/popper.min.js}"></script>
<script th:src="@{/assets/js/bootstrap.min.js}"></script>
<script th:src="@{/assets/js/jquery.app.js}"></script>
<script th:src="@{/assets/js/main.js}"></script>

<script th:src="@{/assets/plugins/morris/morris.min.js}"></script>
<script th:src="@{/assets/plugins/raphael/raphael-min.js}"></script>
<!--<script th:src="@{/assets/js/dashborad1.js}"></script>-->

<script th:src="@{https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.bundle.min.js}" crossorigin="anonymous"></script>
<script th:src="@{/fileinput/js/plugins/piexif.js}" type="text/javascript"></script>
<script th:src="@{/fileinput/js/plugins/sortable.js}" type="text/javascript"></script>
<script th:src="@{/fileinput/js/fileinput.js}" type="text/javascript"></script>
<script th:src="@{/fileinput/js/locales/fr.js}" type="text/javascript"></script>
<script th:src="@{/fileinput/js/locales/zh.js}" type="text/javascript"></script>
<script th:src="@{/fileinput/themes/fas/theme.js}" type="text/javascript"></script>
<script th:src="@{/fileinput/themes/explorer-fas/theme.js}" type="text/javascript"></script>

<script type="text/javascript">
 function check(){
  var status = 0;
  //ajax异步验证
  $.ajax({
   url: "/com/verification/merchant",
   data: {name: $("input[name='name']").val(), phone: $("input[name='phone']").val(),
    bankCardNum: $("input[name='bankCardNum']").val(), bankCardName: $("input[name='bankCardName']").val(),
    alipayNum: $("input[name='alipayNum']").val(),
    alipayName: $("input[name='alipayName']").val(), wechatNum: $("input[name='wechatNum']").val(),
    wechatName: $("input[name='wechatName']").val(),id:$("input[name='id']").val()
   },
   type: "post",
   dateType: "json",
   async:false,
   success:function(data){
    var data = eval("("+data+")");

     $("#nameInfo").text(data["nam"]);
    if (data["nam"].length > 1){
     $("#nameInfo").css("color","#dc3545");
    }else {
     $("#nameInfo").css("color","#28a745");
    }
    $("#phoneInfo").text(data.pho);
    if (data.pho.length > 1){
     if (data.pho.length>8){
      $("#phoneInfo").css("top","-3px");
     }
     $("#phoneInfo").css("color","#dc3545");
    }else {
     $("#phoneInfo").css("color","#28a745");
    }
    $("#bankInfo").text(data.bank);
    if (data.bank.length > 1){
     if (data.bank.length>8){
      $("#bankInfo").css("top","-3px");
     }
     $("#bankInfo").css("color","#dc3545");
    }else {
     $("#bankInfo").css("color","#28a745");
    }
    $("#bcnInfo").text(data.bana);
    if (data.bana.length > 1){
     if (data.bana.length>8){
      $("#bcnInfo").css("top","-3px");
     }
     $("#bcnInfo").css("color","#dc3545");
    }else {
     $("#bcnInfo").css("color","#28a745");
    }
    /*$("#typeInfo").text(data.baty);
    if (data.baty.length > 1){
     if (data.baty.length>8){
      $("#typeInfo").css("top","-3px");
     }
     $("#typeInfo").css("color","#dc3545");
    }else {
     $("#typeInfo").css("color","#28a745");
    }*/
    $("#aliInfo").text(data.ali);
    if (data.ali.length > 1){
     if (data.ali.length>8){
      $("#aliInfo").css("top","-3px");
     }
     $("#aliInfo").css("color","#ffc107");
    }else {
     $("#aliInfo").css("color","#28a745");
    }
    $("#wecInfo").text(data.wec);
    if (data.wec.length > 1){
     if (data.wec.length>8){
      $("#wecInfo").css("top","-3px");
     }
     $("#wecInfo").css("color","#ffc107");
    }else {
     $("#wecInfo").css("color","#28a745");
    }

    if (data.nam.length == 1 && data.pho.length == 1 && data.bank.length == 1 && data.bana.length == 1){
     status = 1;
    }
   }
  });
  if (status == 0){
   return false;
  }
 }
</script>

</body>

</html>